<template>
  <div class="goods">

    <p>{{ uname }}</p>
    <p>{{ age }}</p>
    <p>{{ gender }}</p>

  </div>
</template>

<script>
export default {
  //  接收父组件传递过来的数据
  //  接收到的数据，和data数据一样用，只是不能修改
  // props: ['uname', 'age', 'gender']

  // props也可以写成对象格式（写成对象也是为了加更多配置）
  // 有三个配置可以使用 required表示必填， type类型约束，default默认值

  props: {
    uname: {
      required: true,      //  表示父组件必须给我传递uname
      type: String         //  要求父组件传递过来的uname必须是字符串类型
    },
    age: Number,          //  表示父组件传递过来的值，必须是Number类型的
    gender: {
      default: '未知',
      type: [String, Number]     //  如果允许多种类型，则写成数组格式
    }
  }

}
</script>

<style>

    .goods {
        padding: 10px;
        margin: 8px;
        border: solid 3px black;
        min-height: 50px;
    }

</style>